body,h1 {
	margin: 0;
	padding: 0;
}
.ark-bg {
	z-index: 100;
	position: fixed;
	background-color: #222;
	width: 100%;
	height: 100%;
}

.ark-bluebg {
	z-index: 200;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	background-color: rgb(77, 109, 227);
	width: 100%;
	height: 93%;
	top: 50%;
	transform: translateY(-50%);
}

.ark-pinkbg {
	z-index: 300;
	width: 30%;
	height: 100%;
	background-color: rgb(217, 54, 115);
	animation: goFlat .5s forwards, goSpread .5s .5s forwards, goScale .5s 1s forwards;
}

@keyframes goFlat{
	100%{
		width: 100%;
		height: 30%;
	}
}

@keyframes goSpread{
	to{
		height: 100%;
	}
}

@keyframes goScale{
	to{
		transform: scale(1.4);
	}
}